*{
  margin: 0;
  padding: 0;
}
#header {
  font-style: italic;
  float: left;
  font-family: 'Ubuntu', sans-serif;
  border: 5px outset black;
  width: 14%;
  font-size: 30px;
  margin-left: 15%;
  margin-top: 1%;
  color: rgb(82, 75, 75);
  text-align: center;
}

#content {
  margin-left: 36.5%;
  background-color: black; 
}
.men1{
  width: 140px; 
  background-color: white;
  }
.men2{
  width: 100px; 
  background-color: white;
}
ul {

  list-style: none;

}
ul li {
  position:relative;
  float:left;
  width: 300px;
  height: 60px;
  background-color:white;
  line-height: 60px;
  text-align: center;
  font-size: 22px;
  text-decoration: none;
  margin-top: 0%;
}
ul ul {
  position: absolute;
  top:95%;
  right: 0px;
  display: none ;
  }
  ul li:hover > ul {
      display: block;
   }
   #n1 {
      z-index: 3;
      }
      #n2{
          z-index: 2;
      }

#footer {
  clear: both;
  color: white;
  font-family: 'Ubuntu', sans-serif;
  background-color: rgb(34, 33, 33);
  padding: 2%;
}
#f1 {
  float: left;
  margin-left: 10%;
  font-size: 20px;
  margin-top: -1%;
}
#f2 {
  float:left;
  margin-left: 17%;
  font-size: 30px;
  margin-top: -1%;
}
#f3 {
  margin-left: 75%;
  font-size: 20px;
  margin-top: -1%;
}

@media   (max-width: 1481px) {
  #header{
      width: 10%;
      margin-left: 10%;
      display: inline-block;
      font-size: 20px;
      text-align: center;
  }
      #content {
      margin-left: 25%;
}
  #f2 {
      margin-left: 9%;}
}
  @media   (max-width: 1258px) {
      /* MENU GŁÓWNE */
      #content {
          margin-left: 19%;
      }

      #header {
          margin-left: 5%;
  }
   #f2 {
      margin-left: 8%;
   } 
}

  @media   (max-width: 952px) {
      #header {
          width: 15%;
  } 
  #content {
      width: 15%;
      font-size: 15px;
      margin-left: 40%;
  }
  #f3 {
      width: 40%;
      margin-left: 60%;
  }
  #f2 {
      margin-left: 3%;
      width:  45%;
  }
  #f1 {
      width: 20%;
  }
}
      @media   (max-width: 602px) {
          /* MENU GŁÓWNE */
       ul li{

          font-size: 20px;
          margin-left: -40%;
       }
       #n1{
        margin-left: -39%;
     }
     #n2{
        margin-left: -26%;
     }
     .men2{
         margin-left: -20%;
     }
     .men1{
         margin-left: 3%;
     }
       #header{
          width: 20%;
       }
       #f3 {
         font-size: 10px;
      }
      #f2 {
          font-size: 17px;
          margin-left: -4%;
          padding-left: 5px;
          padding-right: 5px;
      }
      #f1 {
          font-size: 10px;
          margin-left: 10%;
      }
      }
      @media (max-width:388px) {
      #f1 {
          margin-left: 5%;
      }
      #f2 { 
          margin-left: 5%;
          width: 45%;
          font-size: 15px;
      }
  }

  @media (max-width:414px) {
    /* MENU GŁÓWNE */
       ul li {
        margin-left: -10%;
        font-size: 18px;
       }
       #content{
           margin-left: 10%;
       }
       #header{
           width: 50%;
           margin-left:23%;
           margin-top: 3%;
       }
    }
a:link{
  color: black;
}
a:visited{
  color: black;
}
.obrazek
{
  margin-top: 2%;
  clear: both;
  max-width: 34.8%;
  height: auto;
  margin-left: 15%;
  float: left;
  min-width: 250px;
  min-height: 400px;
  margin-bottom: 2%;
}

.glowa
{
  font-family: 'Ubuntu', sans-serif;
  margin-top: 24%;
  float: left;
  font-size: 55px;
  margin-left: 1%;
}
@media (max-width: 1481px){
  .glowa{
    font-size: 50px;
  }
}
@media (max-width: 1100px){
  .glowa{
    font-size: 42px;
    margin-left: 15%;
    margin-top: 0%;
    margin-bottom: 5%;
  }
}
@media (max-width: 500px){
  .glowa{
    font-size: 25px;
    margin-left: 15%;
    margin-top: 0%;
    margin-bottom: 5%;
  }
}

